<template>
	<view>
		<view class="shop-info">
			<view><image :src="picture.pic_cover_micro ? $util.img(picture.pic_cover_micro) : $util.img('upload/uniapp/default_goods.png')"></image></view>
			<view>{{ info.goods_name }}</view>
		</view>
		<button v-if="info.goods_type == 0" type="primary" @click="goShare()">立即使用</button>
		<view class="download ns-padding" v-else-if="info.goods_type == 2">
			<view class="download-name ns-font-size-sm ns-text-color-gray">{{ info.virtual_goods_name }}</view>
			<navigator class="download-btn ns-text-color-gray ns-font-size-sm" :url="'/pages/order/download/download?virtual_code=' + info.virtual_code">去下载</navigator>
		</view>
		<view class="shop-type" v-else-if="info.goods_type == 3">网盘地址/提取码:{{ info.remark }}</view>
		<view class="shop-type" v-else-if="info.goods_type == 4">卡号/密码:{{ info.remark }}</view>
		<navigator class="url" open-type="switchTab" url="/pages/member/index/index">
			<view>会员中心</view>
			<view>点击进入会员中心</view>
		</navigator>
		<ns-login ref="login" href="verification_detail"></ns-login>
	</view>
</template>

<script>
import http from 'common/js/http.js';
import nsLogin from 'components/ns-login/ns-login.vue';
export default {
	components: {
		nsLogin
	},
	data() {
		return {
			vgId: 0,
			verificationDetail: [],
			picture: '',
			info: []
		};
	},
	onLoad(e) {
		this.vgId = e.vg_id;
	},
	onShow() {
		var isLogin = false;
		// #ifdef H5
		getApp().checkLogin(() => {
			isLogin = true;
			setTimeout(() => {
				this.$refs.login.clickLogin();
			}, 100);
		});
		// #endif
		// #ifdef MP
		getApp().$vm.checkLogin(() => {
			isLogin = true;
			this.$refs.login.clickLogin();
		});
		// #endif

		if (isLogin) return;

		this.getVerificationDetail();
	},
	mixins: [http],
	methods: {
		getVerificationDetail() {
			this.sendRequest({
				url: 'System.Order.verificationDetail',
				data: {
					vg_id: this.vgId
				},
				success: res => {
					this.info = res.data;
					this.picture = res.data.picture;
				}
			});
		},
		goShare() {
			var virtual_goods_id = this.info.virtual_goods_id;
			this.$util.redirectTo('/pages/verification/share/share', { vg_id: virtual_goods_id });
		}
	}
};
</script>

<style lang="scss">
page {
	background: #fff;
}
.shop-info {
	background: linear-gradient($base-color, lighten($base-color, 10%)) !important;
	padding-top: 60rpx;
	padding-bottom: 60rpx;
	width: 100vw;
	view {
		text-align: center;
		color: #fff;
		overflow: hidden;
		padding: 0 20rpx;
		text-overflow: ellipsis;
		white-space: nowrap;
		word-break: break-all;
		image {
			width: 100rpx;
			height: 100rpx;
			border-radius: 50%;
		}
	}
}
button {
	margin-top: 60rpx;
	margin-bottom: 120rpx;
	line-height: 80rpx;
}

.url {
	display: flex;
	justify-content: space-between;
	padding: $ns-padding;
	view {
		color: $ns-text-color-gray;
		font-size: $ns-font-size-sm;
	}
}
.shop-type {
	padding: $ns-padding;
	display: flex;
	justify-content: space-between;
	color: $ns-text-color-gray;
	font-size: $ns-font-size-sm;
	view {
		color: $ns-text-color-gray;
		font-size: $ns-font-size-sm;
	}
}
.download-name {
	border-bottom: 2rpx solid $ns-border-color-gray;
	padding-bottom: 10rpx;
}
.download-btn {
	margin-top: 10rpx;
}
</style>
